@extends("front.mean")
@section("content")
    <div id="mainbody">
        @if($assort == 3)
            <div class="info">
                <figure><img src={{asset("blog/images/art.jpg")}}  alt="Panama Hat">
                    <figcaption style="width:94%;text-align: center;font-size:16px;color:#FFFFFF;font-weight: 300">
                        {{--<strong>渡人如渡己，渡已，亦是渡</strong>--}}
                        子 非 鱼<br>
                        安 知 鱼 之 乐<br>
                        但 我 知<br>
                        你 之 痛
                    </figcaption>
                </figure>
                <div class="card" style="font-size:14px;">
                    <h1 style="color:#D1D1D1">我的名片</h1>
                    <p>网名：all by myself </p>
                    <p>职业：PHP 程序员</p>
                    <p>电话：15903600834</p>
                    <p>Email：2296895247@qq.com</p>
                    <ul class="linkmore">
                        <li><a href="/" class="talk" title="给我留言"></a></li>
                        <li><a href="/" class="address" title="联系地址"></a></li>
                        <li><a href="/" class="email" title="给我写信"></a></li>
                        <li><a href="/" class="photos" title="生活照片"></a></li>
                        <li><a href="/" class="heart" title="关注我"></a></li>
                    </ul>
                </div>
            </div>
            @endif
                    <!--info end-->
            <div class="blank"></div>
            <div class="blogs">
                <ul class="bloglist">
                    @if($articles)
                        @foreach($articles as $article)
                            <li>
                                <div class="arrow_box">
                                    <div class="ti"></div>
                                    <!--三角形-->
                                    <div class="ci"></div>
                                    <!--圆形-->

                                    <h2 class="title"><a href="{{route('web.view')}}"
                                                         target="_blank">{!! $article->title !!}</a></h2>
                                    <ul class="textinfo">
                                        @if ($article->img)
                                            <img src={{asset($article->img)}} style="width:130px;height:130px;">
                                        @endif
                                        <a href="{{route('web.view')}}">
                                            <p style="text-overflow:-o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;  ">
                                                {!! $article->content !!}
                                            </p>
                                        </a>
                                    </ul>
                                    <ul class="details">
                                        <li class="likes"><a href="#">10</a></li>
                                        <li class="comments"><a href="#">34</a></li>
                                        <li class="icon-time"><a href="#">{{date("Y-m-d",$article->time)}}</a></li>
                                    </ul>

                                </div>
                                <!--arrow_box end-->
                            </li>
                        @endforeach
                    @endif

                </ul>
                <!--bloglist end-->
                <aside>
                    <div class="tuijian">
                        <h2>推荐文章</h2>
                        <ol>
                            <li><span><strong>1</strong></span><a href="/">有一种思念，是淡淡的幸福,一个心情一行文字</a></li>
                            <li><span><strong>2</strong></span><a href="/">励志人生-要做一个潇洒的女人</a></li>
                            <li><span><strong>3</strong></span><a href="/">女孩都有浪漫的小情怀——浪漫的求婚词</a></li>
                            <li><span><strong>4</strong></span><a href="/">Green绿色小清新的夏天-个人博客模板</a></li>
                            <li><span><strong>5</strong></span><a href="/">女生清新个人博客网站模板</a></li>
                            <li><span><strong>6</strong></span><a href="/">Wedding-婚礼主题、情人节网站模板</a></li>
                            <li><span><strong>7</strong></span><a href="/">Column 三栏布局 个人网站模板</a></li>
                            <li><span><strong>8</strong></span><a href="/">时间煮雨-个人网站模板</a></li>
                            <li><span><strong>9</strong></span><a href="/">花气袭人是酒香—个人网站模板</a></li>
                        </ol>
                    </div>
                    <div class="toppic">
                        <h2>图文并茂</h2>
                        <ul>
                            <li><a href="/"><img src={{asset("blog/images/k01.jpg")}}>腐女不可怕，就怕腐女会画画！
                                    <p>伤不起</p>
                                </a></li>
                            <li><a href="/"><img src={{asset("blog/images/k02.jpg")}}>问前任，你还爱我吗？无限戳中泪点~
                                    <p>感兴趣</p>
                                </a></li>
                            <li><a href="/"><img src={{asset("blog/images/k03.jpg")}}>世上所谓幸福，就是一个笨蛋遇到一个傻瓜。
                                    <p>喜欢</p>
                                </a></li>
                        </ul>
                    </div>
                    <div class="clicks">
                        <h2>热门点击</h2>
                        <ol>
                            <li><span><a href="/">慢生活</a></span><a href="/">有一种思念，是淡淡的幸福,一个心情一行文字</a></li>
                            <li><span><a href="/">爱情美文</a></span><a href="/">励志人生-要做一个潇洒的女人</a></li>
                            <li><span><a href="/">慢生活</a></span><a href="/">女孩都有浪漫的小情怀——浪漫的求婚词</a></li>
                            <li><span><a href="/">博客模板</a></span><a href="/">Green绿色小清新的夏天-个人博客模板</a></li>
                            <li><span><a href="/">女生个人博客</a></span><a href="/">女生清新个人博客网站模板</a></li>
                            <li><span><a href="/">Wedding</a></span><a href="/">Wedding-婚礼主题、情人节网站模板</a></li>
                            <li><span><a href="/">三栏布局</a></span><a href="/">Column 三栏布局 个人网站模板</a></li>
                            <li><span><a href="/">个人网站模板</a></span><a href="/">时间煮雨-个人网站模板</a></li>
                            <li><span><a href="/">古典风格</a></span><a href="/">花气袭人是酒香—个人网站模板</a></li>
                        </ol>
                    </div>
                    <div class="search">
                        <form class="searchform" method="get" action="#">
                            <input type="text" name="s" value="Search" onfocus="this.value=''"
                                   onblur="this.value='Search'">
                        </form>
                    </div>
                    <div class="viny">
                        <dl>
                            <dt class="art"><img src={{asset("blog/images/artwork.png")}} alt="专辑"></dt>
                            <dd class="icon-song"><span></span>南方姑娘</dd>
                            <dd class="icon-artist"><span></span>歌手：赵雷</dd>
                            <dd class="icon-album"><span></span>所属专辑：《赵小雷》</dd>
                            <dd class="icon-like"><span></span><a href="/">喜欢</a></dd>
                            <dd class="music">
                                <audio src="images/nf.mp3" controls></audio>
                            </dd>
                            <!--也可以添加loop属性 音频加载到末尾时，会重新播放-->
                        </dl>
                    </div>
                </aside>
            </div>
            <!--blogs end-->
    </div>
    @endsection
            <!--mainbody end-->

    </body>
    </html>